/**
 * Created by DreamBoy on 2016/6/4.
 */
/**
 * Created by DreamBoy on 2016/4/29.
 */
$(function() {


    $.fn.initInputGroup = function (options) {
        //1.Settings 初始化设置
        var c = $.extend({
            widget: 'input',
            add: "<span class=\"glyphicon glyphicon-plus\"></span>",
            del: "<span class=\"glyphicon glyphicon-minus\"></span>",
            field: '',
            data: []
        }, options);

        var _this = $(this);

        var order = 1;

        //添加序号为1的输入框组
        addInputGroup(order);

        /**
         * 添加序号为order的输入框组
         * @param data 初始化输入框组中的数据
         */
        function addInputGroup() {
            //1.创建输入框组

            var inputGroup = $("<div class='input-group' style='margin: 10px 0'></div>");
            var input0 = $("<span class='input-group-addon' value ='"+order+"'></span>");
            //3.设置输入框组的序号
            input0.html(" " + order + " ");
            //4.创建输入框组中的输入控件（input）
            var input1 = $("<span class='input-group-addon name1'>名称:</span>");
            var widget1 = $("<input class='form-control' id='key1' name='rtProductSizes["+order+"].sizeName' type='text'/>");
            // widget1.prop('id', 'name');
            var input2 = $("<span class='input-group-addon name2'>参数:</span>");
            var widget2 = $("<input class='form-control' id='key2' name='rtProductSizes["+order+"].sizeKey' type='text'/>");
            // widget2.prop('id', 'keys');
            //6.创建输入框组中最后面的操作按钮
            var inputGroupAddon2 = $("<span class='input-group-btn'></span>");
            var addBtn = $("<button class='btn btn-default' type='button'>" + c.add + "</button>");
            addBtn.appendTo(inputGroupAddon2).on('click', function() {
                //7.响应删除和添加操作按钮事件
                if($(this).html() == c.del) {
                    $(this).parents('.input-group').remove();
                    order -- ;
                } else if($(this).html() == c.add) {
                    if(order >= 3){
                        $.modal.alertWarning("规格最多添加三个");
                        return;
                    }
                    $(this).html(c.del);
                    addInputGroup(order);
                    order ++ ;
                }
                //8.重新排序输入框组的序号
                resort();
            });

            inputGroup.append(input0).append(input1).append(widget1).append(input2).append(widget2).append(inputGroupAddon2);

            _this.append(inputGroup);

            if(order + 1 > c.data.length) {
                return;
            }
            addBtn.trigger('click');
        }

        function resort() {
            var child = _this.children();
            $.each(child, function(i) {
                $(this).find(".input-group-addon").eq(0).html(' ' + (i + 1) + ' ');
                $(this).find(".form-control").eq(0).prop("name",'rtProductSizes['+i+'].sizeName');
                $(this).find(".form-control").eq(1).prop("name",'rtProductSizes['+i+'].sizeKey');
            });
        }
    }
});